<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
  <!--组件：传递给组件中的值：props-->
  <xpp v-for="item in items" v-bind:xp="item"></xpp>
</div>
<!--导入vue.js-->
<script src="vue.min.js"></script>
<script>
  //定义一个vue组件component
  Vue.component("xpp",{
    //props 可以用来接收或者传递参数
    props: ['xp'],
    template: ' <li>{{xp}}</li>'
  });
  const vm=new Vue({
    el: "#app",
    data: {
     items: ["迪丽热巴","古力娜扎","马尔咋哈"]
    }
  });

</script>
</body>
</html>